<%-- 
    Document   : content
    Created on : Sep 21, 2012, 8:29:41 AM
    Author     : DucThien
--%>

 <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
        
 
        <div id="deal_top" class="frameWidth"></div>
        
        <div class="frameWidth" id="content">
            <div id="heading_title"> 
                <h1 style="width: 200px; float:left;">List Deal</h1>  
                <div id="button_search" onclick="showHideTableSearch();"><img src="image/button-search.png" /></div>
                <select id="province" style="float:right; margin-right: 10px;">
                    <c:forEach var="province" items="${arrayProvince}">
                        <option value="${province[0]}"><c:out value="${province[1]}"/></option>    
                    </c:forEach>
                </select>
                
            </div>
            <div id="frame-search" style="display:none;">
                <form id="form-search-deal" name="form-search-deal">
                    <table width="100%" >
                        <tr>
                            <td>Dealer Name:</td><td><input type="text" id="search_dealer_name" name="search_dealer_name"  value="" /></td>
                            <td>Deal Name:</td><td><input type="text" id="search_deal_name" name="search_deal_name" value="" /></td>
                            <td>From Cost : </td><td><input type="text" id="search_from_cost" name="search_from_cost" value="" /></td> <td>To Cost :</td><td><input type="text" id="search_to_cost" name="search_to_cost" value="" /></td>
                        </tr>
                        <tr>
                            <td>Percent Discount :</td><td><input type="text" id="search_percent_discount" name="search_percent_discount"  value="" /></td>
                            <td>Dealer Address :</td><td><input type="text" id="search_dealer_address" name="search_dealer_address"  value="" /></td>
                            <td style="text-align: right; padding-right: 2px;">
                                <a class="button" onclick="filterListDeal();">Search</a>  
                            </td>
                            <td style="text-align: left; padding-left : 2px;"> 
                                <a class="button" onclick="filterListDealAll();" >Reset All Field</a>
                            </td> <td></td><td></td>
                        </tr>
                    </table>
                </form>
            </div>
            <div id="middle_content_bottom">
            </div>
        </div>
<div id="login_dialog" style="width: 100% ; display: none; " title="Login"> 
        <table width="100%">
            <tr>
                <td colspan="2" id="error_login" style="text-align: center ; color:red;"  >
                    
                </td>
            </tr>
            <tr>
                <td style="padding:10px;">username :</td>
                <td>
                    <input type="text" name="username" id="username"   />
                </td>
            </tr>
            <tr>
                <td style="padding:10px;">password:</td>
                <td>
                    <input type="password" name="password" id="password"  />
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    If you don't have a account , you can : 
                    <span style="cursor: pointer ; color : blue ; font-family: cambria ; font-weight: 12px;" onclick="showDialogRegistration();">Registration</span>
                </td>
            </tr>
        </table>   
</div>
        <style type="text/css">
            #registration_dialog table tbody tr td span {
                color: red;
                font-family: Times New Roman;
                font-size:13px;
                font-weight: bold;
                font-style: italic;
            }
        </style>
<div id="registration_dialog" style="width: 400px ; display: none; " title="Registration">
    <form action="#" method="POST" id="form-registration" name="form-registration" >
    <table width="100%" >
        <thead>
            <tr>
                <td colspan="2"><span style="color:red; font-size: 14px; ">(*) is require not empty !!!</span></td>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td style="padding:10px;">username:</td>
                <td class="require"><span id="error_username"></span><br /><input type="text" id="user_name" name="user_name" tabindex="1000" /></td>
            </tr>
            <tr>
                <td style="padding:10px;">password:</td>
                <td class="require"><span id="error_password"></span><br /><input type="password" id="pass" name="pass" tabindex='1001' /></td>
            </tr>
            <tr>
                <td style="padding:10px;">Confirm password:</td>
                <td class="require"><span id="error_passwordConfirm"></span><br /><input type="password" id="passConfirm" name="passConfirm" tabindex='1001' /></td>
            </tr>
            <tr>
                <td style="padding:10px;">customer name:</td>
                <td class="require"><span id="error_name"></span><br /><input type="text" id="name" name="name" tabindex="1002" /></td>
            </tr>
            <tr>
                <td style="padding:10px;">identity card:</td>
                <td class="require"><span id="error_identityCard"></span><br /><input type="text" id="identity_card" name="identity_card" onkeypress="return available(event,true);" tabindex="1003" /></td>
            </tr>
            <tr>
                <td style="padding:10px;">number phone:</td>
                <td class="require"><span id="error_numberPhone"></span><br /><input type="text" id="number_phone" name="number_phone" tabindex="1004" onkeypress="return available(event,true);" /></td>
            </tr>
            <tr>
                <td style="padding:10px;">Email:</td>
                <td class="require"><span id="error_email"></span><br /><input type="text" id="email" name="email" tabindex="1005" /></td>
            </tr>
            <tr>
                <td style="padding:10px;">Address:</td>
                <td class="require"><span id="error_address"></span><br /><input type="text" id="address" name="address" tabindex="1006" /></td>
            </tr>
            <tr>
                <td style="padding:10px;">Day Of Birth:</td>
                <td class="require"><span id="error_DOB"></span><br /><input type="text" id="DOB" name="DOB" class="date" tabindex="1007" onkeypress="return false;" /></td>
            </tr>
            <tr>
                <td style="padding:10px;">Field Love :</td>
                <td><span></span><br /><input type="text" id="field_love" name="field_love" tabindex="1008" /></td>
            </tr>
        </tbody>
    </table>
     </form>
</div>
<script type="text/javascript" src="javascript/jquery/ui/jquery-ui-timepicker-addon.js"></script> 
<script type="text/javascript">
    $('.date').datepicker({dateFormat: 'yy-mm-dd'});
    $('.datetime').datetimepicker({
            dateFormat: 'yy-mm-dd',
            timeFormat: 'h:m'
    });
    $('.time').timepicker({timeFormat: 'h:m'});
</script> 
<script type="text/javascript">
    $("#frame-search").hide();
    function showHideTableSearch(){
        if($("#frame-search").is(":visible")){
        $("#frame-search").slideUp('slow');    
        }else{
        $("#frame-search").slideDown('slow');
        }
    }
</script>